<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body,input,button{
            padding:0;
            margin:0;
        }
        .box{
            width: 800px;
            margin:50px auto;
            text-align: center;
        }
        input{
            width: 300px;
            height: 30px;
            font:16px/30px microsoft yahei;
            color:#999;
            text-align:center;
        }
        span{
            display:inline-block;
            height: 30px;
            font:16px/30px microsoft yahei;
            color:#000;
        }
        button{
            width: 80px;
            height:30px;
            font:16px/30px microsoft yahei;
            color:#000;
            text-align:center;
            margin:10px;
        }
    </style>
</head>
<body>
<div class="box">
    <span>距离:</span> <input type="text"><br><br>
    <span>还剩:</span> <input type="text"><br><br>
    <button>开始计时</button> <button>结束计时</button>
</div>
<script>
    var inp=document.getElementsByTagName("input");
    var btn=document.getElementsByTagName("button");
    btn[0].onclick=function(){
        clearInterval(timer);
        var timer=setInterval(function(){
            var myTime=new Date();
            var nowTime=myTime.getTime();
            var future=new Date(2018,2,25,20,09,12);
            var futureTime=future.getTime();
            var n=Math.floor((futureTime-nowTime)/1000);
            var n_day=Math.floor(n/86400);//天
            var n_hour=Math.floor(n%86400/3600);//时
            var n_minute=Math.floor(n%3600/60);//分
            var n_second=n%60;//秒
            inp[0].value="2018年3月28 08：30：12";
            inp[1].value=addZ(n_day)+"天"+addZ(n_hour)+"时"+addZ(n_minute)+"分"+addZ(n_second)+"秒";
            if(n===0){
                clearInterval(timer);
                alert("时间到！！！");
            }
        },1000)
        function addZ(num){
            return num=num<10?"0"+num:""+num;
        }
        btn[1].onclick=function(){
            clearInterval(timer);
        }
    }

</script>
</body>
</html>